<extend name="./public/frame.html"/>
<block name="content">
    <blockquote class="layui-elem-quote search">
        <div class="layui-row" style="float:left;">
            <div class="layui-col-xs3">
                <div class="layui-form">
                    <div class="layui-inline">
                        <div class="layui-input-inline" style="width: 200px;margin-right: 5px;">
                            <select name="brand_id" id="brand_id" lay-verify="required" lay-filter="css">
                                <option value="">请选择品牌</option>
                                <?php foreach($brandList as $key=>$value):?>
                                <option value="<?php echo $value['id'];?>"><?php echo $value['name'];?></option>
                                <?php endforeach;?>
                            </select>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-inline">
            <input type="text" name="name" lay-verify="required|name" required placeholder="车辆类型" class="layui-input" id="name">
        </div>
        <div class="layui-inline">
            <button class="layui-btn" data-type="search">搜索</button>
        </div>
        <div class="layui-inline">
            <button class="layui-btn layui-btn-normal" data-url="{:url('add')}" onclick="add_t(this,'添加类型')">
                添加类型
            </button>
        </div>
    </blockquote>

    <table class="layui-table" lay-data="{width:'auto', height:'auto', url:'{:url('CarType/index')}', page: true, limit: 10, id:'CarType'}" lay-filter="CarType">
        <thead>
        <tr>
            <th lay-data="{checkbox:true, fixed: true}"></th>
            <th lay-data="{field:'id', width:100,fixed: true, sort: true,align:'center'}">ID</th>
            <th lay-data="{field:'name', width:200,align:'center'}">车辆类型</th>
            <th lay-data="{field:'brand_name', width:200,align:'center'}">所属品牌</th>
            <th lay-data="{field:'pic_url', width:200,align:'center'}">品牌图片</th>
            <th lay-data="{field:'status', width:200,align:'center'}">状态</th>
            <th lay-data="{field:'sort', width:200,align:'center'}">排序</th>
            <th lay-data="{field:'create_time', width:200,align:'center',sort: true}">创建时间</th>
            <th lay-data="{fixed:'right', toolbar: '#barDemo', width:200, align:'center'}">操作</th>
        </tr>
        </thead>
    </table>

    <script type="text/html" id="barDemo">
        <a class="layui-btn layui-btn-xs" lay-event="edit" style="width: 50px">修改</a>
        <a class="layui-btn layui-btn-danger layui-btn-sm" lay-event="del" style="width: 50px">删除</a>
    </script>
    <script>
        layui.use('table', function () {
            var table = layui.table;
            table.on('tool(CarType)', function (obj) {
                var data = obj.data;
                var id = data.id;

                if (obj.event === 'del') {
                    layer.confirm('确定删除吗?',function(index){
                        var url = '{:url("/admin/CarType/del","id=")}' + id
                        $.get(url,function(data){
                            if(data.status == 1){
                                layer.msg('成功删除',{'icon':1});
                                window.location.reload();
                            }else{
                                layer.msg('操作失败',{'icon':2});
                            }
                        },'json')
                        layer.close(index);
                    })

                } else if (obj.event === 'edit') {
                    layer.open({
                        type: 2,
                        title: '品牌修改',
                        shadeClose: true,
                        shade: 0.8,
                        area: ['100%', '100%'],
                        content: '{:url("/admin/CarType/edit","id=")}' + id //iframe的url
                    });

                }
            });
            //搜索
            $('.layui-btn').on('click', function () {
                var name = $("#name").val();
                var brand_id = $("#brand_id").val();
                table.reload('CarType', {
                    url: '/admin/CarType/index', where: {
                        "name": name,
                        "brand_id":brand_id
                    }
                });
            })
        });

    </script>
</block>
